<%@ page language="java" import="java.util.*,com.cornergj.model.*" pageEncoding="UTF-8"%>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="cl"%>
<%@ taglib uri="http://java.sun.com/jstl/core_rt" prefix="c"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt"%>
<c:set var="ctx" value="<%=request.getContextPath()%>"/>
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="description" content="">
    <meta name="author" content="">
    <title>Corner家政 --个人信息</title>
    
     <!-- core CSS -->
    <link href="${ctx}/css/bootstrap.min.css" rel="stylesheet">
    <link href="${ctx}/css/font-awesome.min.css" rel="stylesheet">
    <link href="${ctx}/css/prettyPhoto.css" rel="stylesheet">
    <link href="${ctx}/css/animate.min.css" rel="stylesheet">
    <link href="${ctx}/css/main.css" rel="stylesheet">
    <link href="${ctx}/css/responsive.css" rel="stylesheet">
	
	<link rel="shortcut icon" href="${ctx }/favicon/favicon.ico" type="image/x-icon">
    <script type="text/javascript">
	//如果不是顶级窗口，则先获取顶级窗口，再跳转到登录界面
	if(!(window.parent == window)){
		var topWin= (function (p,c){
		    while(p!=c){
		        c = p        
		        p = p.parent
		    }
		    return c
		})(window.parent,window);
		topWin.location.href='${ctx}' + "/frontpage/toindex.do";
	}
	</script>
	<style>
		.close{
			color:#000;
		}
	</style>    
</head><!--/head-->
<body>
    <header id="header">
        <!-- 页脚模块 -->
   	<%@include file="fronthead.jsp"%>
        
    </header><!--/header-->
    
    <section id="content" class="shortcode-item">
        <div class="container">
            <div class="row">
                <div class="col-xs-12 col-sm-7">
                    <h2>用户个人信息</h2> 
                    <div class="tab-wrap">
                        <div class="media">
                            <div class="parrent pull-left">
                                <ul class="nav nav-tabs nav-stacked">
                                    <li class="active"><a href="#tab1" data-toggle="tab" class="analistic-01">用户头像</a></li>
                                    <li class=""><a href="#tab2" data-toggle="tab" class="analistic-02">用户个人信息</a></li>
                                    <li class=""><a href="#tab3" data-toggle="tab" class="tehnical">修改密码</a></li>
                                    <li class=""><a href="#tab4" data-toggle="tab" class="tehnical">登录信息</a></li>
                                    <li class=""><a href="#tab5" data-toggle="tab" class="tehnical">服务信息</a></li>
                                </ul>
                            </div>

                            <div class="parrent media-body">
                                <div class="tab-content">
                                    <div class="tab-pane active in" id="tab1">
                                        <div class="media">
                                           <div class="pull-left">
                                                <img class="img-responsive" src="${COMMONUSER.headimgUrl }" style="width:200px;height:200px">
                                            </div>
                                            <div class="media-body">
                                                 <h4>${COMMONUSER.username }</h4>
                                                 <p style="font-size:0.2px">用户标志：${COMMONUSER.userUuid }</p>
                                            </div>
                                        </div>
                                    </div>

                                     <div class="tab-pane" id="tab2">
                                        <div class="media">
                                            <div class="media-body">
                                                 <h4>用户联系方式：</h4><p>&nbsp;&nbsp;&nbsp;${useInfo.phone }</p>
                                                 <h4>用户注册邮箱：</h4><p>&nbsp;&nbsp;&nbsp;${useInfo.email }</p>
                                            </div>
                                        </div>
                                     </div>

                                     <div class="tab-pane" id="tab3">
                                        <p>该功能暂未开通，敬请期待！</p>
                                     </div>
                                     
                                     <div class="tab-pane" id="tab4">
                                        <p>该功能暂未开通，敬请期待！</p>
                                     </div>

                                     <div class="tab-pane" id="tab5">
                                        <p>该功能暂未开通，敬请期待！</p>
                                     </div>
                                </div> <!--/.tab-content-->  
                            </div> <!--/.media-body--> 
                        </div> <!--/.media-->     
                    </div><!--/.tab-wrap-->               
                </div><!--/.col-sm-6-->

                <div class="col-xs-12 col-sm-5">
                    <h2>预约订单信息</h2>
                    <div class="accordion">
                    	<div class="panel-group" id="accordion1">
                    	<c:choose>
                             <c:when test="${empty orderList}">
                                  	<h2>您暂未预约任何订单！</h2>
                             </c:when>
                             <c:otherwise>
                                <c:forEach items="${orderList }" var="item" varStatus="status">
                    				<c:choose>
                                    	<c:when test="${status.count=='1'}">
                          						<div class="panel panel-default">
                            						<div class="panel-heading active">
                              							<h3 class="panel-title">
                                							<a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion1" href="#collapseOne1">
                                  								预约订单号：${item.orderCode }【<fmt:formatDate value="${item.createTime }" type="date" pattern="yyyy-MM-dd" />】
                                  								<i class="fa fa-angle-right pull-right"></i>
                               								 </a>
                              							</h3>
                            						</div>

                            						<div id="collapseOne1" class="panel-collapse collapse in">
                              							<div class="panel-body">
                                  							<div class="media accordion-inner">
                                  								<c:if test="${item.arrange=='1'}">
                                  									<div class="pull-left">
                                  										<c:forEach items="${nannylist }" var="nannyitem" varStatus="status">
                                  											<c:choose>
                             													<c:when test="${nannyitem.id==item.arrangeNannyId}">
                             														<h3>保姆：${nannyitem.truename }</h3>
                                  													<img class="img-responsive" src="${nannyitem.nannyUrl }" style="width:100px;height:100px" title="姓名：${nannyitem.truename }&#10;联系电话：${nannyitem.phone }&#10;联系地址：${nannyitem.address}">
                             													</c:when>
                             													<c:otherwise>
                             														对不起，查询不到服务保姆信息，或许该人员已经离职！
                             													</c:otherwise>
                             												</c:choose>
                                            							</c:forEach>
                                        							</div>
                                  								</c:if>
                                        						<div class="media-body">
                                             						<h4>订单状态：
                                             							<c:choose>
                             												<c:when test="${item.arrange=='1'}"><span>已安排</span></c:when>
                                             								<c:otherwise><span>暂未安排服务人员</span></c:otherwise>
                                             							</c:choose>
                                             						</h4>
                                             						<p>订单费用：<span style="color:red">￥${item.cost }</span></p>
                                             						<p>付款：
                                             							<c:choose>
                             												<c:when test="${item.pay=='1'}"><span>已付款</span></c:when>
                                             								<c:otherwise><span>未付款(暂只支持线下付款方式)</span></c:otherwise>
                                             							</c:choose>
                                             						</p>
                                             						<p>服务开始时间：<fmt:formatDate value="${item.serviceTime }" type="date" pattern="yyyy-MM-dd" /></p>
                                             						<p>服务周期：${item.serviceCycle }个月</p>
                                             						<p>备注信息：${item.remarks }</p>
                                             						<p style="float:right">>>>评论预约订单</p>
                                        						</div>
                                  							</div>
                              							</div>
                            						</div>
                          						</div>
                                    	</c:when>
                                    	<c:otherwise>
                                    		<div class="panel panel-default">
                            					<div class="panel-heading">
                              						<h3 class="panel-title">
                                						<a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion1" href="#collapse${status.count}">
                                  							预约订单号：${item.orderCode }【<fmt:formatDate value="${item.createTime }" type="date" pattern="yyyy-MM-dd" />】
                                  							<i class="fa fa-angle-right pull-right"></i>
                                						</a>
                              						</h3>
                            					</div>
                            					<div id="collapse${status.count}" class="panel-collapse collapse">
                              						<div class="panel-body">
                              							<div class="media accordion-inner">
                                        						<c:if test="${item.arrange=='1'}">
                                  									<div class="pull-left">
                                  										<c:forEach items="${nannylist }" var="nannyitem" varStatus="status">
                                  											<c:choose>
                             													<c:when test="${nannyitem.id==item.arrangeNannyId}">
                                  													<img class="img-responsive" src="${nannyitem.nannyUrl }" style="width:100px;height:100px">
                             													</c:when>
                             													<c:otherwise>
                             														对不起，查询不到服务保姆信息，或许该人员已经离职！
                             													</c:otherwise>
                             												</c:choose>
                                            							</c:forEach>
                                        							</div>
                                  								</c:if>
                                        						<div class="media-body">
                                             						<h4>订单状态：
                                             							<c:choose>
                             												<c:when test="${item.arrange=='1'}"><span>已安排</span></c:when>
                                             								<c:otherwise><span>暂未安排服务人员</span></c:otherwise>
                                             							</c:choose>
                                             						</h4>
                                             						<p>订单费用：<span style="color:red">￥${item.cost }</span></p>
                                             						<p>付款：
                                             							<c:choose>
                             												<c:when test="${item.pay=='1'}"><span>已付款</span></c:when>
                                             								<c:otherwise><span>未付款(暂只支持线下付款方式)</span></c:otherwise>
                                             							</c:choose>
                                             						</p>
                                             						<p>服务开始时间：<fmt:formatDate value="${item.serviceTime }" type="date" pattern="yyyy-MM-dd" /></p>
                                             						<p>服务周期：${item.serviceCycle }个月</p>
                                             						<p>备注信息：${item.remarks }</p>
                                        						</div>
                                  							</div>
                              						</div>
                            					</div>
                          					</div>
                                   		</c:otherwise>
                                	</c:choose>
                    			</c:forEach>
                             </c:otherwise>
                        </c:choose>
                        </div><!--/#accordion1-->
                    </div>
                </div>
            </div><!--/.row-->
        </div><!--/.container-->
    </section><!--/#content-->

    <!-- 页脚模块 -->
   	<%@include file="frontfoot.jsp"%>
	 <!-- 上传头像模块 -->
	<%
  		if(session.getAttribute("COMMONUSER")!=null){
  	%>
  		<%@include file='uploadAvatar.jsp'%>
  	<%
		}
	 %>
    <script src="${ctx}/js/jquery.js"></script>
    <script src="${ctx}/js/bootstrap.min.js"></script>
    <script src="${ctx}/js/jquery.prettyPhoto.js"></script>
    <script src="${ctx}/js/jquery.isotope.min.js"></script>
    <script src="${ctx}/js/main.js"></script>
    <script src="${ctx}/js/wow.min.js"></script>
</body>
</html>